<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>Document</title>
    <link rel="stylesheet" href="../../../../src/css/common/reset.css">
    <link rel="stylesheet" href="../../../../src/css/common/common.css">
    <link rel="stylesheet" href="album.css">
</head>
<body>

<div class="main">
        <!--查看图片组件-->
        <section class="album">
            <div class="album-title">
                <div class="title-back"><i class="iconfont ">sss</i></div>
                <div class="title-number">
                    <span id="title-grade">1</span>/<span id="title-grades">10</span>
                </div>
            </div>

            <ul class="album-item">
                <li class="item-list fx-col-c"><img src="../../src/img/banner1.jpg" alt=""></li>
                <li class="item-list fx-col-c"><img src="../../src/img/banner2.jpg" alt=""></li>
                <li class="item-list fx-col-c"><img src="../../src/img/banner3.jpg" alt=""></li>
            </ul>
        </section>
        <!--***********图片组件子列表模板*************-->
        <ul id="model-2" class="hide">
            <li class="item-list fx-col-c"><img src="" alt=""></li>
        </ul>
        <!--*****************************************-->

</div>


<script type="text/javascript" src="/data/src/lib/zepto.js"></script>
<script type="text/javascript" src="album.js"></script>
<script>



    var str = '',imgId = '';


        var a = new Album({
            currentObj:$('.album'),
            speed:400,
            grade:0,
            grades:3,
            //回退按钮回调函数
            callback:function(){$('.album').hide()},
            scale:false
        });

</script>
</body>
</html>